<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>帮助中心</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="stylesheet" href="/web/res/css/xadmin.css">
    <script src="/web/res/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="/web/res/js/xadmin.js"></script>
</head>

<body>
<div class="x-nav">
        <span class="layui-breadcrumb">
            <a href="">首页</a>
            <a href="">帮助中心</a>
            <a><cite>反馈管理</cite></a>
        </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       onclick="location.reload()" title="刷新">
        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a>
</div>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">

                    <a class="layui-btn layui-btn-small lable-text-center"
                       style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()"
                       title="刷新">
                        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>刷新表格数据</a>
                </div>

                <div class="layui-card-body ">
                    <form class="layui-form layui-col-space5" type="post" action="/after/feedback/fklist">
                        <div class="layui-input-inline layui-show-xs-block">
                            <input type="text" name="nick" value="${nick!''}" placeholder="用户名"
                                   autocomplete="off" class="layui-input">
                        </div>
                        <div class="layui-input-inline layui-show-xs-block">
                            <input type="text" name="phone" value="${phone!''}" placeholder="手机号"
                                   autocomplete="off" class="layui-input">
                        </div>

                        <div class="layui-input-inline layui-show-xs-block">
                            <input class="layui-input" placeholder="开始时间" autocomplete="off" value="${startDate!''}"
                                   name="start" id="start">
                        </div>
                        <div class="layui-input-inline layui-show-xs-block">
                            <input class="layui-input" placeholder="截止时间" autocomplete="off" value="${endDate!''}"
                                   name="end" id="end">
                        </div>

                        <div class="layui-input-inline layui-show-xs-block">
                            <button class="layui-btn" lay-submit lay-filter="search">
                                <i class="layui-icon">&#xe615;</i>搜索
                            </button>
                        </div>
                    </form>
                </div>

                <div class="layui-card-body">
                    <table class="layui-table layui-form tableH" lay-size="sm" id="tab">
                        <thead>
                        <tr>
                            <th>用户名称</th>
                            <th>用户头像</th>
                            <th>用户电话</th>
                            <th>内容</th>
                            <th>图片</th>
                            <th>反馈时间</th>
                            </th>
                        </tr>
                        </thead>
                        <tbody>
                            <#list list as inv>
                            <tr>
                                <td>${inv.nick!''}</td>
                                <td>
                                    <a href="javascript:void(0);" class="img_biges" title="${(inv.pic)!''}">
                                        <img src="${(inv.pic)!''}" style=" width:35px;height:35px;"/>
                                </td>
                                <td>${inv.phone!''}</td>
                                <td>${inv.nierong!''}</td>
                                <td>
                                    <#if inv.tupian?? && inv.tupian !=''>
                                    <#if inv.tupian?contains(",")>
                                    <a href="javascript:void(0);" class="img_biges" title="${(inv.tupian)!''}">
                                        <img src="${(inv.tupian?split(","))[0]} " style=" width:35px;height:35px;border-radius: 5px;"/>
                                        <#else>
                                        <a href="javascript:void(0);" class="img_biges" title="${(inv.tupian)!''}">
                                            <img src="${(inv.tupian)!''}" style=" width:35px;height:35px;border-radius: 5px;"/>
                                        </#if>
                                        <#else>
                                        <div class="divimg"><i class="layui-icon layui-icon-picture-fine"></i>
                                        </div>
                                    </#if>
                                </td>

                                <td>${inv.createtime?string("yyyy-MM-dd HH:mm:ss")!}</td>
                            </tr>
                            </#list>
                        </tbody>
                    </table>
                </div>
                <!-- 分页条 -->
                <div id="pager" style="text-align: center;"></div>
            </div>
        </div>
    </div>
    <input type="hidden" id="remark" name="remark">
</div>
</body>

<script>
    layui.use(['laydate', 'form', 'table','carousel'], function () {
        let $ = layui.$;
        var laydate = layui.laydate;
        var form = layui.form;
        var table = layui.table;
        var carousel = layui.carousel;

        // 监听全选
        form.on('checkbox(checkall)', function (data) {
            if (data.elem.checked) {
                $('.check input').prop('checked', true);
            } else {
                $('.check input').prop('checked', false);
            }
            form.render('checkbox');
        });

        //执行一个laydate实例
        laydate.render({
            elem: '#start' //指定元素
        });

        //执行一个laydate实例
        laydate.render({
            elem: '#end' //指定元素
        });
        //显示图片
        $('.img_biges').on('click', function () {
            const str = $(this).attr('title');
            swiperim(str);
        });

        // 逗号隔开的多图地址预览
        function swiperim(url) {
            var str = url.split(',')
            var htmlstr = '<div class="layui-carousel" id="test10" style="overflow:hidden"><div carousel-item>'
            str.forEach(e => {
                htmlstr += '<div style="line-height:377px;text-align:center;"><img src="' + e + '" style="max-width:100%;max-height:100%;background-size:contain;"></div>'
        })
            htmlstr += '</div></div>'
            layer.open({
                type: 1,
                title: false,
                closeBtn: 0,
                area: ['600px', '377px'],
                skin: 'layui-layer-nobg',
                shadeClose: true,
                content: htmlstr
            });
            //图片轮播
            carousel.render({
                elem: '#test10'
                , width: '600px'
                , height: '377px'
                , interval: 5000
            });
        }
    });



</script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
    layui.use(['laypage', 'layer', 'form'], function () {
        let $ = layui.$;
        var laypage = layui.laypage
                , form = layui.form
                , layer = layui.layer;

        laypage.render({
            elem: 'pager'
            , count: ${splitPage.totalCount}
            , limit: ${splitPage.pageSize}
            , curr: ${splitPage.pageIndex}
            , layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
            , jump: function (obj, first) {
                //首次不执行
                if (!first) {
                    var myform = document.forms[0];
                    // alert("formName:"+myform.id);
                    var pageIndex = document.createElement("input");
                    pageIndex.name = "pageIndex";
                    pageIndex.type = "hidden";
                    pageIndex.value = obj.curr;
                    myform.appendChild(pageIndex);

                    var pageSize = document.createElement("input");
                    pageSize.name = "pageSize";
                    pageSize.type = "hidden";
                    pageSize.value = obj.limit;
                    myform.appendChild(pageSize);
                    // myform.submit();

                    // $("button[lay-filter]")
                    // form.on('submit(button[lay-filter])', function(data){
                    //     // layer.msg(JSON.stringify(data.field));
                    //     // return false;
                    // });
                    // var submitBtn = $("button[lay-submit]");
                    // alert(submitBtn);
                    // console.log(submitBtn)
                    // layer.msg(JSON.stringify(submitBtn));

                    // $('[lay-filter="search"]').click();
                    // $('#chaxun').click();
                    $("button[lay-submit]:eq(0)").click();
                    // $("button[lay-submit]")[0].click();
                    // alert($("#formsubmit").attr("action")+"_获取数量："+obj.limit+"_页码数："+obj.curr);
                    // console.log(obj)
                }
            }
        });
    });
</script>


</html>